import React, { Component } from "react";
import {
  View,
  Clipboard,
  Text,
  TouchableOpacity,
  Image,
  ScrollView
} from "react-native";
import NavBarConfig from "../modules/NavBar";
import { WALLET, BGT, ORIGIN, BGT_INFO, MEMBER } from "../../config/Api";
import http from "../../util/http";
import Qrcode from "react-native-qrcode";
import { toast } from "../../util/tip";
import scriptionStyles from "../../style/pages/subscription";
class Subscription extends Component {
  static navigationOptions = ({ navigation }) =>
    NavBarConfig(
      {
        headerTitle: "認購"
      },
      navigation
    );
  state = {
    wallet: {},
    credit: {},
    bgt: {},
    qrcode: null,
    tel: ""
  };

  async handleInit() {
    const data = await http.get(WALLET);
    this.setState({
      wallet: data.data
    });
  }

  createCopyClip() {
    Clipboard.setString(this.state.wallet.address);
    toast("複製修改");
  }

  async getCredit() {
    const data = await http.get(BGT);
    this.setState({
      credit: data.data
    });
  }

  async getMemberInfo() {
    const data = await http.get(MEMBER);
    this.setState({
      tel: data.data.tel
    });
  }

  async getBgt() {
    const data = await http.get(BGT_INFO);
    this.setState({
      bgt: data.data
    });
  }

  componentWillMount() {
    this.handleInit();
    this.getMemberInfo();
  }

  componentDidMount() {
    this.getBgt();
    this.getCredit();
  }

  render() {
    return (
      <ScrollView style={scriptionStyles.subScriptionContainer}>
        <View>
          <View style={scriptionStyles.subItem}>
            <Text
              style={[
                scriptionStyles.subListItem,
                {
                  flex: 1
                }
              ]}
            >
              当前购入比
            </Text>
            <Text style={[scriptionStyles.subListItem]}>
              1 USDT : {parseFloat(this.state.bgt.deposit_usdt_rate || 10)} BGT
            </Text>
          </View>
          <View style={scriptionStyles.subItem}>
            <Text
              style={[
                scriptionStyles.subListItem,
                {
                  flex: 1
                }
              ]}
            >
              可購額度
            </Text>
            <Text style={[scriptionStyles.subListItem]}>
              {this.state.credit.credit - this.state.credit.freeze_credit || 0}
            </Text>
          </View>
          <View style={scriptionStyles.subItem}>
            <Text
              style={[
                scriptionStyles.subListItem,
                {
                  flex: 1
                }
              ]}
            >
              代幣
            </Text>
            <Text style={[scriptionStyles.subListItem]}>
              {this.state.wallet.amount}
            </Text>
          </View>
        </View>
        <View style={scriptionStyles.copyUrl}>
          <View>
            <Text>{this.state.wallet.address}</Text>
          </View>
          <TouchableOpacity onPress={this.createCopyClip.bind(this)}>
            <Text style={scriptionStyles.copyBtn}>複製鏈接</Text>
          </TouchableOpacity>
        </View>
        <View
          style={{
            alignItems: "center"
          }}
        >
          <Qrcode
            size={180}
            value={JSON.stringify({
              path: "Subscription",
              url:
                ORIGIN + "/Subscription/?address=" + this.state.wallet.address,
              params: {
                address: this.state.wallet.address,
                tel: this.state.tel
              }
            })}
          />
        </View>

        <View
          style={{
            alignItems: "center"
          }}
        >
          <View style={[scriptionStyles.subFriendtTip]}>
            <Image
              style={scriptionStyles.tipBg}
              source={require("../../assets/friend-tip.png")}
            />
            <View style={scriptionStyles.tipContent}>
              <Text style={scriptionStyles.tipItem}>
                1、禁止充值除USDT之外的其他資產，任何非USDT資產充值將不可找回
              </Text>
              {/* <Text style={scriptionStyles.tipItem}>
                2、1USDT = 1000 代幣, 1BGT=1代幣
              </Text> */}
              {/* <p>
                3、复制钱包地址或使用手机APP扫描二维码，把您
                的USDT发送到该地址进行充值。
              </p> */}
              <Text style={scriptionStyles.tipItem}>
                2、複製錢包地址，把您的USDT發送到該地址進行充值。
              </Text>
              <Text style={scriptionStyles.tipItem}>
                3、充值後自動認購可用額度範圍內的BGT，剩餘的USDT轉至錢包；
                USDT轉入後需一小時內到賬，請注意查收。
              </Text>
            </View>
          </View>
        </View>
      </ScrollView>
    );
  }
}

export default Subscription;
